import React, {Component} from 'react';
import {StyleSheet, View, Text, Button} from 'react-native';
import NavigationUtil from '../navigator/NavigationUtil';
import AsyncStorage from '@react-native-community/async-storage';
import actions from '../action/index';
import {connect} from 'react-redux';

class WelcomePage extends Component {
  componentDidMount() {
    const {onThemeInit} = this.props;
    onThemeInit();
    this.timer = setTimeout(() => {
      // const {navigation} = this.props;
      // navigation.navigate('Main');
      // NavigationUtil.resetToHomePage({
      //   navigation: this.props.navigation,
      // });
      this._bootstrapAsync();
    }, 2000);
  }
  UNSAFE_componentWillMount() {
    this.timer && clearTimeout(this.timer);
  }

  _bootstrapAsync = async () => {
    const userToken = await AsyncStorage.getItem('userToken');
    this.props.navigation.navigate(userToken ? 'Main' : 'Auth');
  };
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}> WelcomePage </Text>
      </View>
    );
  }
}

const mapStateToProps = state => ({
  nav: state.nav,
});
const mapDispatchToProps = dispatch => ({
  onThemeInit: () => dispatch(actions.onThemeInit()),
});

export default connect(
  mapStateToProps,
  mapDispatchToProps,
)(WelcomePage);

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
});
